<html>
<head>
  <title>batchjs</title>
  <style>
  body {
    margin: 0;
    padding: 0;
    min-height: 100%;
    background: #654;
    color: #f0f0f0;
    font: 75% "Consolas", monospace;
  }
  html {
    margin: 0;
    padding: 0;
    min-height: 100%;
  }
  textarea {
    border: 0;
    padding: 5px;
    width: 50%;
    height: 100%;
    margin: 0;
    font: 100% "Consolas", monospace;
    resize: none;
  }
  #input {
    float: left;
    color: #403a30;
    background: #fed;
  }
  #output {
    float: right;
    color: #f0f0f0;
    background: #543;
    cursor: default;
  }
  </style>
</head>
<body>
<textarea id="input">
var connector = require("../../src/runtime/jaba");

batch(let db : connector) {  
  db.Customers.forEach(function(customer) {
    customer.Orders.forEach(function(order) {     
          var total = order.OrderDetails.UnitPrice * order.OrderDetails.Quantity;
          if( total > 2000 ) {
          console.log("Customer="
            + customer.CustomerID
            + " Order="
          + order.OrderID + " Total="
          + total);
          }
    });
  });
};
</textarea>
<textarea id="output"></textarea>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
  function update() {
    var inp = $('#input').val();
    $.post('http://nodejs:8124/update/', {inp: inp}, function(data) {
      $('#output').val(data);
    }, 'text');
  }

  $ii = false;
  $('#input').on('keyup', function(e) {
    if( e.keyCode < 35 || e.keyCode > 40 ) {
      clearTimeout($ii);
      $ii = setTimeout(update, 500);
    }
  });
  update();
</script>

</body>
</html>